@import "common.less";

.home{
  width: 750/@rem;height: 2230/@rem;background: url(../img/homebg.jpg) no-repeat;background-size: 750/@rem 2230/@rem;position: relative;margin: 0 auto;
  .logo{width: 138/@rem;height: 23/@rem;background: url(../img/ndlogo.png) no-repeat;background-size: 138/@rem 23/@rem;position: absolute;right: 19/@rem;top: 9/@rem;}
  .title{
      width: 750/@rem;height: 225/@rem;position: absolute;top: 46/@rem;left: 0;
      img{width: 100%;vertical-align: middle;}
      p{color: #fff;font-size: 32/@rem;line-height: 39/@rem;margin-top: 19/@rem;text-align: center;}
  }
  .tipsbox{
      width: 750/@rem;position: absolute;left: 0;top: 379/@rem;
      img{width: 100%;vertical-align: middle;}
      .tips_title{font-size: 39/@rem;line-height: 55/@rem;color: #fff;text-align: center;margin: -10/@rem 0 15/@rem;}
      .tips_txt{font-size: 18/@rem;line-height: 26/@rem;text-align: center;color: #ffee07;margin-bottom: 10/@rem;}
  }
  .uploadbox{
      width: 100%;position: absolute;left: 0;top: 850/@rem;
      .filebtn{
          width: 414/@rem;height: 88/@rem;line-height: 88/@rem;border: 5/@rem solid #713f04;background: -webkit-linear-gradient(90deg, #f7e81f, #fff45d);border-radius: 196/@rem;display: block;margin: 0 auto;text-align: center;font-size: 41/@rem;color: #603300;position: relative;
          input{width: 414/@rem;height: 88/@rem;position: absolute;left: 0;top: 0;background: none;font-size: 0;opacity: 0;}
      }
      .uploadtxt{
          width: 548/@rem;height: 157/@rem;background: #fffcd2;border-radius: 10/@rem;margin: 40/@rem auto 0;padding: 22/@rem;
          textarea{background: none;border: 0;width: 100%;height: 100%;resize: none;color: #ab8a66;font-size: 26/@rem;line-height: 32/@rem;}
      }
      p{
        text-align: center;
        .selectbtn{
          text-align: center;display: inline-block;font-size: 20/@rem;height: 34/@rem;margin: 0 auto;color: #fffea5;text-decoration: underline;margin-top: 26/@rem;
          em{color: #fffc00;font-style: normal;}
        }
      }

      .submitbtn{width: 414/@rem;height: 88/@rem;line-height: 88/@rem;border: 5/@rem solid #98000d;background: -webkit-linear-gradient(90deg, #e33d4b, #eb707a);border-radius: 196/@rem;display: block;margin: 55/@rem auto;text-align: center;font-size: 41/@rem;color: #fff;}
  }
  .case{
      width: 750/@rem;text-align: center;position: absolute;left: 0;top: 1475/@rem;color: #fab261;font-size: 28/@rem;line-height: 36/@rem;
      img{width: 100%;vertical-align: middle;margin-top: 50/@rem;}
  }
}

.clipbox{position: fixed;left: 0;top: 0;width: 100%;height: 100%;display: none;background: rgba(0,0,0,0.75);}
#clipArea{position: absolute;left: 0;top: 0;width: 100%;height: 100%;}
#clipBtn{position: absolute;left: 50%;bottom: 30/@rem;color: #fff;border: 0;background: -webkit-linear-gradient(90deg, #f7e81f, #fff45d);width: 324/@rem;height: 76/@rem;line-height: 76/@rem;border-radius: 162/@rem;border: 5/@rem solid #713f04;color: #603300;text-align: center;font-size: 36/@rem;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);}
.blesslayout{
  width: 100%;height: 100%;position: fixed;left: 0;top: 0;overflow: auto;
  .bless{
    position: absolute;left: 0;top: 0;width: 100%;height: 2230/@rem;background: #6a3d07;
    .blessbox{
      width: 664/@rem;margin: 64/@rem auto 0;
      a{
        display: block;line-height: 45/@rem;font-size: 26/@rem;color: #6c3a00;background: #e2d7ac;border-radius: 6/@rem;margin-bottom: 30/@rem;padding: 10/@rem;
        &.active{background: #dcc72a;}
      }
    }
    .blessbtn{
      width: 664/@rem;margin: 0 auto;
      a{width: 304/@rem;height: 73/@rem;line-height: 73/@rem;border: 5/@rem solid #713f04;background: -webkit-linear-gradient(90deg, #f7e81f, #fff45d);border-radius: 156/@rem;display: inline-block;text-align: center;font-size: 36/@rem;}
      a:first-child{float: left;}
      a:last-child{float: right;}
    }
  }
}

.uploadLoding{position: fixed;left: 0;top: 0;width: 100%;height: 100%;background: url(../img/loading.png) no-repeat center;background-size: 26/@rem 26/@rem;animation:circle 1s infinite linear;}
.uploadOk{position: fixed;left: 0;top: 0;width: 100%;height: 100%;background: url(../img/finish.png) no-repeat center;background-size: 205/@rem 142/@rem;}

.homeloading{
  position: fixed;left: 0;top: 0;z-index: 5;width: 100%;height: 100%;background: url("/src/img/homeloading.jpg");background-size: cover;
}